<template>
	<view>
		<!-- 正文 -->
		<view v-if="!networkStatus">
			<!-- <nonetword @onclick="getList"></nonetword> -->
		</view>
		<view v-if="networkStatus">
			<!-- <tui-skeleton v-if="skeletonShow" backgroundColor="#fafafa"></tui-skeleton> -->
			<hx-navbar :config="navConfig"></hx-navbar>
			<view class="main-body-view" :style="{top:statusBarHeight}">
				<!-- <view class="apply-status-pic"><image src="../../../../static/img/apply-status.png" mode="widthFix"></image></view> -->
				<!-- <view class="apply-txt">{{data.list.check_estate_name}}</view> -->
				<view class="group">
					<view class="title">邀请码</view>
					<input class="u-input"  placeholder="" :disabled="disabled" v-model="data.list.invite_code"/>
				</view>
				<view class="group">
					<view class="title"><text class="mast"> *</text>公司/门店名称</view>
					<input class="u-input" focus placeholder="请输入公司名称"  v-model="data.list.company_name"/>
				</view>
				
				<view class="group">
					<view class="title"><text class="mast"> *</text>联系电话</view>
					<input class="u-input" focus placeholder="联系电话"  :disabled="disabled"  v-model="data.list.mobile"/>
				</view>
				<view class="group">
					<view class="title"><text class="mast"> *</text>联系人名称</view>
					<input class="u-input" focus placeholder="名称"  :disabled="disabled"  v-model="data.list.contact_name"/>
				</view>
				<view class="group">
					<view class="title"><text class="mast"> *</text>地址</view>
					<view>{{data.list.address}}</view>
					<!-- <input class="u-input" focus placeholder=""  :disabled="disabled"  v-model=""/> -->
				</view>
			<!-- 	<view class="group">
					<view class="title">采购员身份证</view>
					<input class="u-input" focus placeholder="身份证号码"  :disabled="disabled"  v-model="data.list.id_card_code"/>
				</view> -->
				<!-- <view class="group">
					<view class="title">采购员真实姓名</view>
					<input class="u-input" focus placeholder="真实姓名"  :disabled="disabled"  v-model="data.list.realname"/>
				</view> -->
				
				<view class="group">
					<view class="title">电子邮箱</view>
					<input class="u-input" focus placeholder="请输入电子邮箱地址"  :disabled="disabled"  v-model="data.list.email"/>
				</view>
				<view class="group remove">
					<view class="title"><text class="mast"> *</text>营业执照</view>
					
				</view>
				<view class="tui-box-upload">
					<!-- <tui-upload :limit="5" :dirType="2" :userType="2" :serverUrl="serverUrl" @complete="result" @remove="remove"></tui-upload> -->
				   <view class="img">
					    <image mode="widthFix" v-for="(item,index) in data.list.license_image"   :src="item.src" @tap="imageSee(data.list.license_image,item.src)"></image>
						
				   </view>
				   <view>
					   有效时间：长期
				   </view>
				</view>
				<view class=" remove">
					<view class="title1"><text class="mast"> *</text>医疗器械经营许可证和第二类医疗器械经营备案凭证</view>
					
				</view>
				<view class="tui-box-upload">
					<!-- <tui-upload :limit="5" :dirType="2" :userType="2" :serverUrl="serverUrl" @complete="result" @remove="remove"></tui-upload> -->
				   <view class="img">
					    <image mode="widthFix" v-for="(item,index) in data.list.business_certificate_image"   :src="item.src" @tap="imageSee(data.list.business_certificate_image,item.src)"></image>
						
				   </view>
				   <view>
				   		<text class="mast"> *</text>有效时间：{{data.list.business_certificate_time||''}}
				   </view>
				</view>
				<view class=" remove">
					<view class="title1">医疗机构执业许可证</view>
					
				</view>
				<view class="tui-box-upload">
					<!-- <tui-upload :limit="5" :dirType="2" :userType="2" :serverUrl="serverUrl" @complete="result" @remove="remove"></tui-upload> -->
				   <view class="img">
					    <image mode="widthFix" v-for="(item,index) in data.list.medical_certificate_image"   :src="item.src" @tap="imageSee(data.list.business_certificate_image,item.src)"></image>
						
				   </view>
				  <!-- <view>
				   		有效时间：{{data.list.medical_certificate_time||''}}
				   </view> -->
				</view>
				<!-- <view class="" >
					<view class="title1">
						<text style="color: red;">*</text> 授权经营范围(多选)
					</view>
					<view class="input" style="width: 100%; padding: 20rpx;line-height: 50rpx;">
						
							
						 <rudon-multiSelector welcome="请选择经营范围" :is_using_slot="false" :is_using_icon="true" :localdata="data.scopeList" @change="whenChanged"></rudon-multiSelector>
					</view>
				</view> -->
				<view class="group remove">
					<view class="title">食品经营许可证</view>
					
				</view>
				<view class="tui-box-upload">
					<!-- <tui-upload :limit="5" :dirType="2" :userType="2" :serverUrl="serverUrl" @complete="result" @remove="remove"></tui-upload> -->
				   <view class="img">
					    <image mode="widthFix" v-for="(item,index) in data.list.food_certificate_image"   :src="item.src" @tap="imageSee(data.list.id_card_image,item.src)"></image>
						
				   </view>
				   <view>
				   		有效时间：{{data.list.food_certificate_time||''}}
				   </view>
				</view>
				<view class="group remove">
					<view class="title">身份证扫描件</view>
					
				</view>
				<view class="tui-box-upload">
					<!-- <tui-upload :limit="5" :dirType="2" :userType="2" :serverUrl="serverUrl" @complete="result" @remove="remove"></tui-upload> -->
				   <view class="img">
					    <image mode="widthFix" v-for="(item,index) in data.list.id_card_image"   :src="item.src" @tap="imageSee(data.list.id_card_image,item.src)"></image>
						
				   </view>
				   <view>
				   		有效时间：{{data.list.id_card_time||''}}
				   </view>
				</view>
				<view class="group remove">
					<view class="title">采购委托书</view>
					
				</view>
				<view class="tui-box-upload">
					<!-- <tui-upload :limit="5" :dirType="2" :userType="2" :serverUrl="serverUrl" @complete="result" @remove="remove"></tui-upload> -->
				   <view class="img">
					    <image mode="widthFix" v-for="(item,index) in data.list.letter_image"   :src="item.src"></image>
						
				   </view>
				   <view>
				   		有效时间：{{data.list.letter_time||''}}
				   </view>
				</view>
				
				<view class="" >
					<view class="title1">
						 原因
					</view>
					<view class="input" style="width: 100%;height: 150rpx;padding: 20rpx; ">
						<input class="u-input"    placeholder="请输入拒绝原因"    v-model="reason"/>
							
					</view>
				</view>
				<view style="height: 100rpx;"></view>
				
			</view>
			<!-- <view class="foot-btn"  v-if="data.list.check_estate ==2">
				<view class="btn" @click="confirm(3)">拒绝</view>
				<view  class="btn" @click="confirm(1)">授权</view>
			</view> -->
			<!-- <view class="place-bottom"></view> -->
			<!-- <tui-modal :show="modal" @click="modalClick" @cancel="modalHide" content="确定清理缓存吗？" color="#333" :size="32" :button="modalButton" shape="circle"></tui-modal> -->
			<!-- 弹框 -->
			<uni-popup ref="checkEstate"  type="center" custom="true">
				<view class="check-content">
					<view class="title">
						确认操作！
					</view>
					<view  v-if="check_estate ==1" style="padding: 20rpx;">
						确认通过审核吗？
					</view>
					<view v-else style="padding: 20rpx;">
						确认不通过审核吗！
					</view>
					<!-- <view v-if="check_estate ==1">
						<view class="tips">
							确认审核通过,选取授权经营范围！
						</view>
						<view class="group" >
							<view class="title1">
								<text>*</text> 授权经营范围(多选)
							</view>
							<view class="input" style="width: 100%; padding: 20rpx;line-height: 50rpx;">
								
									
								 <rudon-multiSelector welcome="请选择经营范围" :is_using_slot="false" :is_using_icon="true" :localdata="data.scopeList" @change="whenChanged"></rudon-multiSelector>
							</view>
						</view>
					</view>
					<view v-else>
						<view class="group" >
							<view class="title1">
								<text>*</text> 原因
							</view>
							<view class="input" style="width: 100%;height: 100rpx;">
								<input class="u-input"   focus placeholder="请输入拒绝原因"    v-model="reason"/>
									
							</view>
						</view>
					</view> -->
					
					<view class="btn-check" >
						<view class="btn close-btn" @tap="$refs.checkEstate.close()">取消</view>
						<view class="btn confirm-btn" @tap="confirmCheck()">确认</view>
					</view>
				</view>
				
			</uni-popup>
			<tui-tips ref="toast"></tui-tips>
			<!-- 登录弹框 -->
			<uni-popup-vlogin id="popupvLogin" ref="popupvLogin" type="bottom" />
		</view>
	</view>
</template>
<script>
	import tuiUpload from '@/components/tui-upload/tui-upload'
	// 推广名片
	import _app from '@/js_sdk/QuShe-SharerPoster/util/QS-SharePoster/app.js';
	import {
		getSharePoster
	} from '@/js_sdk/QuShe-SharerPoster/util/QS-SharePoster/QS-SharePoster.js';
	import rudonMultiSelector from '@/components/rudon-multiSelector/rudon-multiSelector';
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	//公共底部组件引入
	// import btabbar from '@/components/bottomtabbar.vue'
	// 公共底部
	// import btabbar from '@/components/indexBottomTable/bottomtabbar.vue'

	import {
		mapGetters
	} from 'vuex';
	export default {
		data() {
			return {
				id:'',
				disabled:true,
				statusBarHeight:'',
				imageData:[],
				serverUrl:'',
				isTop: 0,
				heightVal: '-112rpx',
				//网络状态
				networkStatus: true,
				skeletonShow: true,
				fixedTop: 140,
				navConfig: {
					backgroundImg: 'https://xoimg.aiouning.com/static/LH_user_img/nav.png',
					title: '详情',
					color: '#fff',
					fontSize: 12,
					back: true,
					height: 175
				},
				//接口数据
				data: {
					list:{
						company_name:'',
						mobile:'',
						contact_name:'',
						id_card:'',
						email:'',
						license_image:[],
						id:''
					},
					//客服电话
					serviceMobile: '18677057271',
					//个人信息,
					userInfo: {
						nickname: '游客',
						face: '',
						signature: '点击昵称跳转登录/注册页',
						integral: 0,
						balance: 0,
						envelope: 0,
						exp: 0,
						upExp: 0,
						vipname: ''
					},
					
					scopeList:[],

				},
				company_type:[
					{
						val:0,
						name:'单体药店'
					},
					{
						val:1,
						name:'连锁总部'
					},
					{
						val:2,
						name:'商业公司'
					},
					{
						val:3,
						name:'诊所/卫生室/医院'
					},
					{
						val:4,
						name:'连锁加盟/直营'
					},
					{
						val:5,
						name:'医疗器械经营店'
					},
					
					
				],
				checkIndex:'',
				check_estate:0,
				scope_ids:[],
				reason:'',
				headerPosition: "fixed",
				headerTop: null,
				statusTop: null,
				showHeader: true,
				// 推广名片
				hasLogin: false,
				poster: {},
				qrShow: false,
				canvasId: 'default_PosterCanvasId',

				modal: false,
				//确认弹框
				modalButton: [{
					text: "取消",
					type: 'gray'
				}, {
					text: "确定"
				}],
				qrUrl: '',
				// 节点
				//生成二维码地址
				qrImgHost: '',
				OSS_HOST: 'https://xoimg.aiouning.com/static/',
				// OSS_HOST:'../../static/',

			}
		},
		components: {
		
			tuiUpload,
			rudonMultiSelector,
			uniPopup

		},
		computed: {
			...mapGetters(['netWorkType', 'loginStatus']),
			expup: function() {
				return parseInt(this.data.userInfo.exp / this.data.userInfo.upExp * 100)
			}
		},
		onPageScroll: function(e) {

			if (e.scrollTop > 100) {
				this.isTop = 1
			} else {
				this.isTop = 0
			}
		},
		//下拉刷新，需要自己在page.json文件中配置开启页面下拉刷新 "enablePullDownRefresh": true
		onPullDownRefresh() {
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onPageScroll(e) {
			//兼容iOS端下拉时顶部漂移
			this.headerPosition = e.scrollTop >= 0 ? "fixed" : "absolute";
			this.headerTop = e.scrollTop >= 0 ? null : 0;
			this.statusTop = e.scrollTop >= 0 ? null : -this.statusHeight + 'px';
		},
		onLoad(e) {
			console.log(e)
			let _this = this
			this.GetStatusBarHeight();
			this.statusHeight = 0;
			this.id=e.id;
			// #ifdef APP-PLUS
			this.showHeader = false;
			this.statusHeight = plus.navigator.getStatusbarHeight();
			// #endif
			if (!this.loginStatus) {
				store.dispatch('changeLogin', false)
			}
			this.qrImgHost = this.$service.getQrImgHost()
			//获取满屏高度
			uni.getSystemInfo({
				success: function(res) {
					// _this.fixedTop = (res.screenHeight-568)+140
				}
			});
			
			this.serverUrl = this.$service.getImgHost()
			this.getList()

		},
		onReady() {
			//此处，演示,每次页面初次渲染都把登录状态重置
			// uni.setStorage({
			// 	key: 'UserInfo',
			// 	data: false,
			// 	success: function () {
			// 	},
			// 	fail:function(e){
			// 	}
			// });
		},
		onShow: function() {
			// this.heightVal='-'+(140+44-uni.getSystemInfoSync().statusBarHeight)+ 'px';
			// #ifdef MP-WEIXIN
			if (wx.hideHomeButton) {
				wx.hideHomeButton();
			}
			// #endif
			
		},
		filters: {
			iconFilters: function(x) {
				return he.decode(x);
			}
		},
		methods: {
			confirm(estate){
				let _this = this;
				_this.check_estate =estate
				_this.$refs.checkEstate.open()
				console.log(1111111)
			},
			checkedStoreType(item){
				console.log(item)
				this.checkIndex = item.val
			},
			confirmCheck(){
				let _this = this
				uni.showLoading({
					title: '加载中'
				});
				let data ={
					check_estate:_this.check_estate,
					reason:_this.reason||'',
					scope_ids:_this.scope_ids||'',
					company_type:_this.checkIndex,
					company_name:_this.data.list.company_name,
					id:_this.id
					
				}
				var opt = {
					url: '/User/checkBusiness',
					data: data,
					success: function(res) {
						//console.log(res)
						if (res.status == 1) {
							uni.hideLoading();
							uni.showToast({
								icon:'none',
								title:'操作成功'
							})
							_this.$refs.checkEstate.close();
							_this.getList()
							
						} else {
							uni.hideLoading();
							uni.showToast({
								icon:'none',
								title:res.message
							})
				
						}
				
					}
				};
				//登陆状态才远程访问资源
				_this.$service.GetApi(opt)
			},
			whenChanged(e) {
				let _this =this
					// console.log(JSON.stringify(e))
					this.data.scopeList = e
					let arr = [];
					
					this.data.scopeList.forEach(function(v){
						if(v.is_selected){
							
							arr.push(v.id)
						}
						
					})
					_this.scope_ids=  arr
					// console.log(this.scope_ids,'选中*******')
							
			},
			imageSee(imgArr,src){
				console.log(src,imgArr)
				let arr =[]
				imgArr.forEach(function(item){
					arr.push(item.src)
				})
				uni.previewImage({
				  current: src, // 当前显示图片的http链接
				  urls: arr // 需要预览的图片http链接列表
				})
			},
			edit(){
				let _this=this;
				_this.$refer.setVilit('/packageUser/pages/user/business_enter/edit');
				// let data =JSON.stringify(_this.data.list);
				let imgArr=[];
				if(_this.data.list.license_image.length){
					
					imgArr=_this.data.list.license_image.map(function(cv){
						return cv.path
					})
					
				}
				let data={
					company_name:_this.data.list.company_name,
					mobile:_this.data.list.mobile,
					contact_name:_this.data.list.contact_name,
					id_card:_this.data.list.id_card,
					email:_this.data.list.email,
					license_image:JSON.stringify(imgArr),
					id:_this.data.list.id
				}
				let callback = function(url) {
					_this.$refs.popupvLogin.open()
				}
				_this.$refer.toUrl(callback,data)
			},
			GetStatusBarHeight() {
					let that = this;
					wx.getSystemInfo({
						success: function(res) {
							that.statusBarHeight=(res.statusBarHeight+44+15)+'px'; //这就是状态栏的高度
							console.log(that.statusBarHeight)
						},
					});
				},
			result: function(e) {
				console.log(e)
				this.imageData = e.imgArr;
				uni.setStorageSync('business_license',JSON.stringify(this.imageData));
			},
			remove: function(e) {
				//移除图片
				console.log(e)
				let index = e.index
			},
			navClick(url) {
				// console.log(url)


				let _this = this

				if (url == 'stop') {
					let options = {
						msg: '即将开放',
						type: 'danger'
					};
					_this.$refs.toast.showTips(options);
					return
				}

				this.$refer.setVilit(url)
				let callback = function(url) {

					_this.$refs.popupvLogin.open()
				}

				this.$refer.toUrl(callback)
			},
			// 刷新的方法
			refresh() {
				this.getList();
			},
			// 跳转的方法
			swiperChange(active, url) {
				const _this = this
				uni.setStorageSync('commonBottomActive', active);
				// uni.redirectTo({
				// 		url: url
				// })
				_this.$refer.setVilit(url)
				let callback = function(url) {
					_this.$refs.popupvLogin.open()
				}
				_this.$refer.toUrl(callback, '', 'redirectTo')
			},
			//初始页方法
			getList() {
				const _this = this
				uni.showLoading({
					title: '加载中'
				});

				var opt = {
					url: '/User/businessInfo',
					data: {id:_this.id},
					success: function(res) {
						//console.log(res)
						if (res.status == 1) {
							uni.hideLoading();
							_this.data.list=JSON.parse(JSON.stringify(res.data.list))
							_this.checkIndex = _this.data.list.company_type
							console.log(_this.checkIndex)
							_this.data.scopeList = res.data.scopeList
						} else {
							uni.hideLoading();
							

						}

					}
				};
				//登陆状态才远程访问资源
				_this.$service.GetApi(opt)


				
			}





		}
	}
</script>
<style lang="scss">
	@import "./index.scss";
</style>
